<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Tryrun 1</title>
</head>
<body>
    <div id="view">
        <p>点击下面的按钮，将 Ajax 请求回来的数据更新在该文本内</p>
    </div>
    <button type="button" id="btn">发起 Ajax 请求</button>

    <script>
        document.getElementById("btn").onclick = ajaxRequest;

        function ajaxRequest () {
            var xhr = new XMLHttpRequest();
            //本地请求w3c有跨域问题
            //可以自行开启一个本地服务去请求
            xhr.open("GET", "https://www.w3cschool.cn/statics/demosource/ajax_info.txt", true);
            xhr.send();

            xhr.onreadystatechange = function(){
                if (xhr.readyState === 4 && xhr.status === 200) {
                    document.getElementById("view").innerHTML = xhr.responseText;
                }                
            }
        }
    </script>
</body>